// import { divide, multiply } from "mathjs";

export interface Component {
  dataAliase?: Record<string, any>;
  dataBinding?: Record<string, any>;
  id?: string;
  isLock?: boolean;
  component: string;
  label: string;
  propValue: string | Record<string, any>;
  icon: string;
  request?: Record<string, any>;
  style: Record<string, any>;
  styleFilter?: string;
  // common attr
  collapseName?: string;
  events: Array<any>;
  animations?: any;
  belong?: string;
  onlyScalePos?: boolean;
}

const needToChangeAttrs: string[] = ["width", "height", "top", "left", "fontSize", "padding"];

export function deepCopy(target) {
  if (typeof target == "object") {
    const result = Array.isArray(target) ? [] : {};
    for (const key in target) {
      if (typeof target[key] == "object") {
        result[key] = deepCopy(target[key]);
      } else {
        result[key] = target[key];
      }
    }

    return result;
  }

  return target;
}
// 根据比例缩放组件尺寸
export function changeComponentsSizeWithScale(compList: Component[], preScale: number, curScale: number): void {
  // const componentData: any[] =
  //   deepCopy(compList);
  const componentData: any[] = compList.map(item => item["item"]);
  componentData.forEach((component: Component) => {
    if (component.component === "VImage") {
      const top = parseFloat((((component.style["top"] as number) / preScale) * curScale).toFixed(4));
      const left = parseFloat((((component.style["left"] as number) / preScale) * curScale).toFixed(4));

      component.style["transform"] = "translate3d(" + left + "px, " + top + "px, 0) scale(" + curScale / 100 + ")";
    } else {
      Object.keys(component.style).forEach((key: string) => {
        if (needToChangeAttrs.includes(key)) {
          let newKey: number;

          // 否则根据当前画布的比例计算新的属性值
          newKey = parseFloat((((component.style[key] as number) / preScale) * curScale).toFixed(4));

          if (key == "top" || key == "left") {
            if (component.onlyScalePos) {
              //临时方案，位置修正，为什么这么做尤其时dx/2 我也很懵逼，我猜是放大时width height未参与放大，但是原本的算法里默认放大width和height影响到了位置
              let dx = (component.style["width"] / preScale) * curScale - component.style["width"];
              let dy = (component.style["height"] / preScale) * curScale - component.style["height"];
              newKey = newKey + (key === "top" ? dy : dx / 2);
            }
            component.style[key] = newKey;
          } else if (!component.onlyScalePos) {
            component.style[key] = newKey === 0 ? 1 : newKey;
          }
        }
      });
    }
  });

  // setComponentData(componentData);
  // // 更新后的组件数据
  // setCurComponent({
  //   component: componentData[curComponentIndex.value],
  //   index: curComponentIndex.value
  // });
}

// const needToChangeAttrs2: string[] = ["width", "height", "fontSize", "padding"];

// export function changeComponentSizeWithScale(component): void {
//   Object.keys(component.style).forEach((key: string) => {
//     if (needToChangeAttrs2.includes(key)) {
//       if (key === "fontSize" && component.style[key] === "") return;

//       component.style[key] = format(
//         component.style[key] as number,
//         canvasStyleData.value.scale
//       );
//     }
//   });
// }

// function format(value: number, scale: number): number {
//   return multiply(value, divide(parseFloat(scale.toString()), 100)) as number;
// }
